<template>
  <base-breadcrumb>
    <div
      v-loading="loading.DETAIL"
      class="about-master-container"
    >
      <a-card :bordered="false">
        <title-name :title="disabled ? '信息详情' : '基本信息'" />
        <a-form-model
          ref="form"
          :model="formInfo"
          :rules="rules"
        >
          <a-row>
            <a-col span="16">
              <a-form-model-item label="所属单位">
                <org-tree-select
                  v-model="formInfo.myId"
                  disabled
                  placeholder="请选择"
                  is-auto-select-first
                  :is-query-projec-detail="false"
                  @select="selectOrg"
                />
              </a-form-model-item>
            </a-col>
<!--                        <a-col span="8">-->
<!--                          <a-form-model-item label="所属分公司">-->
<!--                            <SelectSubCompany disabled :isDefaultSelected="true" v-model="formInfo.branchComId" placeholder="请选择" />-->
<!--                          </a-form-model-item>-->
<!--                        </a-col>-->
<!--                        <a-col span="8">-->
<!--                          <a-form-model-item label="所属项目">-->
<!--                            <SelectProject-->
<!--                              disabled-->
<!--                              :isDefaultSelected="true"-->
<!--                              v-model="formInfo.projectId"-->
<!--                              placeholder="请选择"-->
<!--                              :form="formInfo"-->
<!--                              :is-edit="formInfo.id !== ''"-->
<!--                              :is-clear="formInfo.id !== ''"-->
<!--                              key-value="branchComId"-->
<!--                            />-->
<!--                          </a-form-model-item>-->
<!--                        </a-col>-->
            <a-col span="8">
              <a-form-model-item
                label="安全技术交底名称"
                prop="name"
              >
                <BaseInput
                  v-model="formInfo.name"
                  :disabled="disabled"
                  placeholder="请输入"
                />
              </a-form-model-item>
            </a-col>
            <a-col span="8">
              <a-form-model-item
                label="交底人"
                prop="employeeId"
              >
                <SelectPersonByProject
                  v-model="formInfo.employeeId"
                  placeholder="请选择"
                  :disabled="disabled"
                  :is-edit="formInfo.id !== ''"
                  :project-id="formInfo.projectId"
                />
              </a-form-model-item>
            </a-col>
            <a-col span="8">
              <a-form-model-item
                label="监督审核人"
                prop="supervisorId"
              >
                <SelectPersonByProject
                  v-model="formInfo.supervisorId"
                  placeholder="请选择"
                  :disabled="disabled"
                  :is-edit="formInfo.id !== ''"
                  :project-id="formInfo.projectId"
                />
              </a-form-model-item>
            </a-col>
            <a-col span="8">
              <a-form-model-item
                label="交底时间"
                prop="confessDate"
              >
                <a-date-picker
                  v-model="formInfo.confessDate"
                  :disabled="disabled"
                  placeholder="请输入"
                />
              </a-form-model-item>
            </a-col>
            <a-col span="8">
              <a-form-model-item
                label="被交底单位"
                prop="discloseDeptIds"
              >
                <a-select
                  v-model="formInfo.discloseDeptIds"
                  :disabled="disabled"
                  mode="multiple"
                  :allow-clear="true"
                  :show-search="true"
                  option-filter-prop="children"
                  filter-option
                  placeholder="请选择"
                >
                  <a-select-option
                    v-for="i in subcontractorList"
                    :key="i.id"
                    :value="i.subContractorId"
                  >
                    {{ i.name }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col span="8">
              <a-form-model-item
                label="工种"
                prop="workType"
              >
                <BaseInput
                  v-model="formInfo.workType"
                  :disabled="disabled"
                  placeholder="请输入"
                />
              </a-form-model-item>
            </a-col>
            <a-col
              v-if="formInfo.id"
              span="24"
            >
              <div style="margin-left: 100px;margin-bottom: 20px;">
                <a-button
                  type="primary"
                  @click="signInVsible = true"
                >
                  查看签到
                </a-button>
                <a-button
                  v-if="!disabled"
                  style="margin-left: 20px;"
                  type="primary"
                  @click="handleLargeScreen"
                >
                  会议大屏
                </a-button>
              </div>
            </a-col>
            <a-col span="24">
              <a-form-model-item
                label="交底内容"
                prop="confessContent"
              >
                <a-textarea
                  v-model="formInfo.confessContent"
                  placeholder="请输入"
                  :auto-size="{ minRows: 20, maxRows: 25 }"
                  :disabled="disabled"
                />
              </a-form-model-item>
            </a-col>
            <a-col span="24">
              <a-form-model-item label="现场照片">
                <upload-list
                  upload-type="image"
                  :business-code="'SHE06'"
                  :disabled="disabled"
                  :edit-model="editModel"
                  :upload-arrys.sync="formInfo.fileInfoList"
                  multiple
                />
              </a-form-model-item>
            </a-col>
          </a-row>
        </a-form-model>
      </a-card>

      <div
        v-if="!disabled"
        class="tool-btns page-btn-right-top"
      >
        <!--        <a-button v-if="formInfo.id" type="danger" @click="del()">删除草稿</a-button>-->
        <a-button
          :loading="loading.DRAFT"
          type="primary"
          @click="save('DRAFT',false)"
        >
          二维码签到
        </a-button>
        <a-button
          :loading="loading.SUBMITTED"
          type="primary"
          @click="submit('SUBMITTED')"
        >
          提交
        </a-button>
        <a-button
          type="primary"
          @click="$close"
        >
          关闭
        </a-button>
      </div>
      <div
        v-else
        class="tool-btns page-btn-right-top"
      >
        <BasePrintButton
          type="primary"
          :before-print-fn="print"
        />
        <a-button
          type="primary"
          class="ml20"
          @click="$close"
        >
          关闭
        </a-button>
      </div>
    </div>

    <!-- 查看签到模态框 -->
    <SeeSign
      :id="formInfo.id"
      :visible="signInVsible"
      :is-new="true"
      @cancel="signInVsible = false"
      @confirm="signInVsible = false"
    />
  </base-breadcrumb>
</template>

<script>
import SelectSubCompany from '@/components/Select/SelectSubCompany' // 分公司
import SelectProject from '@/components/Select/SelectProject' // 项目
import { getSubcontractor } from '@/api/businessAffairs/sml'
import BasePrintButton from '@/components/BasePrintButton' // 打印按钮
import {
  getSafteyRecordDetail,
  addSafteyRecord,
  updateSafteyRecord,
  deleteSafteyRecord,
  getSafteyRecordDetailPrint, selectMeetConfig, addSafteyRecord2, updateSafteyRecord2, deleteSafteyRecord2
} from '@/api/safetySupervision/safteyClosureRecord'
import UploadList from '@/components/UploadList'
import { Empty } from 'ant-design-vue' // 无数据提示
import { isAttachment } from '@/utils/util'
import SelectPersonByProject from '@/components/Select/SelectPersonByProject'
import SeeSign from './components/SeeSign'
import ConferenceScreen from '@/components/ConferenceScreen'

export default {
  name: 'a' + Date.now(),
  components: {
    SelectSubCompany,
    SelectProject,
    UploadList,
    Empty,
    BasePrintButton,
    SelectPersonByProject,
    SeeSign,
    ConferenceScreen
  },
  data() {
    return {
      signInVsible: false,
      loading: {
        DETAIL: false,
        DELETE: false,
        DRAFT: false,
        SUBMITTED: false,
        PRINT: false
      },
      printContent: '',
      editModel: '',
      formInfo: {
        myId: '',
        id: '',
        employeeId: undefined,
        supervisorId: undefined,
        planDetailsVO: {},
        fileInfoList: []
      },
      rules: {
        name: [{ required: true, message: '请输入安全技术交底名称' }],
        employeeId: [{ required: true, message: '请选择交底人' }],
        supervisorId: [{ required: true, message: '请选择监督审核人' }],
        confessDate: [{ required: true, message: '请选择交底时间' }],
        discloseDeptIds: [{ required: true, message: '请选择被交底单位' }],
        workType: [{ required: true, message: '请输入工种' }],
        confessContent: [{ required: true, message: '请输入交底内容' }]
      },
      subcontractorList: [] //分包商列表
    }
  },
  watch: {
    'formInfo.projectId'() {
      this.getSubcontractorList()
    }
  },
  computed: {
    pageType() {
      return this.$route.query.pageType || 'look'
    },
    disabled() {
      return this.$route.query.pageType === 'look'
    }
  },
  created() {
    // formInfo.projectId
    if (this.$route.query.id) {
      this.formInfo.id = this.$route.query.id
      this.getDetail()
    }
    if (this.$route.query.pageType === 'edit') {
      this.formInfo.myId = this.$userInfo().currentPost.projectId || this.$userInfo().currentPost.orgId
      this.editModel = 2
    } else {
      this.editModel = 0
    }
  },
  methods: {
    selectOrg(val) {
      if(val.length > 1) {
        this.formInfo.projectId = val[val.length - 1].projectId
        this.formInfo.branchComId = val[val.length - 2].orgId
      } else {
        this.formInfo.branchComId = val[val.length - 1].orgId
      }
    },
    async handleLargeScreen() {
      this.loading.DETAIL = false
      let res = await selectMeetConfig({ id: this.formInfo.id })
      this.loading.DETAIL = false
      if (res.code === this.SUCCESS_CODE) {
        const routeData = this.$router.resolve({
          path: '/conferenceScreen',
          query: {
            orCode: res.data
          }
        })
        window.open(routeData.href, '_blank')
      }
    },
    print() {
      return getSafteyRecordDetailPrint({ id: this.formInfo.id }).then((res) => {
        return res[1].data.content
      })
    },
    //获取分包商列表
    async getSubcontractorList() {
      if (!this.formInfo.projectId) return
      this.loading.DETAIL = true
      let res = await getSubcontractor({ id: this.formInfo.projectId })
      this.loading.DETAIL = false
      this.subcontractorList = res.data || []
    },
    async getDetail() {
      this.loading.DETAIL = true
      const res = await getSafteyRecordDetail({ id: this.formInfo.id })
      this.loading.DETAIL = false
      if (res.code === 200) {
        this.formInfo.projectId = res.data.projectId
        this.formInfo.myId = res.data.projectId
        await this.getSubcontractorList()
        this.formInfo = { ...this.formInfo, ...res.data }
        this.formInfo.fileInfoList = this.formInfo.fileInfoList || []
      }
    },
    async del() {
      this.$delList3(deleteSafteyRecord2, () => {
        this.$close()
      }, { id: this.formInfo.id })
    },
    async submit() {
      if (this.formInfo.id && await this.save('SUBMITTED', true)) {
        return this.$close()
      } else (!await this.save('DRAFT', true))
      {
        return this.submit()
      }
    },
    async save(auditStatus, isSubmit = false) {
      return new Promise(async resolve => {
        let isPass = true
        if (isSubmit) {
          if (!this.formInfo.fileInfoList.length) {
            isPass = false
            return this.$noticeWarning('请上传照片')
          }
          this.$refs.form.validate(valid => {
            isPass = valid
          })
        }
        if (isPass) {
          this.$refs.form.clearValidate()
          let res
          let temp = this.$clone(this.formInfo)
          temp.auditStatus = auditStatus
          temp.safetyConfessRecordType = 1
          this.loading[auditStatus] = true
          if (temp.id) {
            res = await updateSafteyRecord2(temp)
          } else {
            res = await addSafteyRecord2(temp)
          }
          if (res.code === 200) {
            this.formInfo.id = res.data.id
            await this.getDetail()
            if (auditStatus === 'DRAFT') {
              if (!isSubmit) {
                this.$message.success('保存成功')
                this.handleLargeScreen()
              }
            } else {
              this.$message.success('提交成功')
            }
            resolve(true)
          }
          this.loading[auditStatus] = false
        } else {
          this.$noticeWarning('请填写完整')
        }
      })
    }
  }
}
</script>

<style lang="less" scoped>
@deep: ~'>>>';
.tool-btns {
  display: flex;
  justify-content: flex-end;

  @{deep} .ant-btn + .ant-btn {
    margin-left: 12px;
  }
}
</style>
